<template>
  <div class="home">
    <!-- 头部 -->
    <myheader></myheader>
    <!-- 左中右 -->
     <div class="box">
        <!-- 左 -->
        <myleft class="left"></myleft>
        <!-- 中 -->
        <mycotenent class="boxitem"></mycotenent>
        <!-- 右 -->
        <myright class="right"></myright>
     </div>
  </div>
</template>

<script setup>
import myheader from "@/components/MyHeader"
import myleft from "@/components/MyLeft"
import myright from '@/components/Myright'
import mycotenent from '@/components/MyCotenent'



</script>
<style lang="scss" scoped>
.home{
  width:100%;
  height:100%;
  background-image: url('@/assets/bg.a6333996.jpg');
  background-size: 100% 100%;
}
.box{
  margin-top: 20px;
  text-align: center;
  width: 100%;
  color: #fff;
  display: flex;
  // padding: 10px  0;
  justify-content:space-around;
  .boxitem{
    height: calc(100vh - 130px);
    width: 820px;
    // background-color: pink;
    // margin: 0 10px;

  }
  .left{
    width: 505px;
  //  margin-left: 15px;

  //  flex: 1;
  //  background-color: yellowgreen;
  }
  .right{
    width: 505px;
  //  flex: 1;
  // margin-right: 15px;
  //  background-color: plum;
  }
}
</style>
